<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>淘宝网 -淘！我喜欢</title>
    <link rel="icon" href="taobao.ico">
    <link rel="stylesheet" href="css/index.css">
    <base href="" target="_blank">
</head>
<body>
    <!-- 头部信息 -->
    <div id="headMessage" class="clearfix layer">

        <ul class="fl">
            <li>
                <span>中国大陆</span>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
            <li>
                <a href="#" class="login mr7">亲，请登录</a>
                <a href="#">免费注册</a>
            </li>
            <li>
                <a href="#">手机逛淘宝</a>
            </li>
        </ul>

        <ul class="fr">
            <li>
                <a href="#">我的淘宝</a>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
            <li>
                <span class="iconfont mr5">&#xe50e;</span>
                <a href="#">购物车</a>
                <strong>0</strong>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
            <li>
                <a href="#"><span class="iconfont mr5">&#xe50d;</span>收藏夹</a>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
            <li>
                <a href="#">商品分类</a>
            </li>
            <li>
                <li class="line">|</li>
            </li>
            <li>
                <a href="#">千牛卖家中心</a>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
            <li>
                <a href="#">联系客服</a>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
            <li>
                <span class="iconfont mr5">&#xe610;</span>
                <a href="#">网站导航</a>
                <span class="iconfont arrow">&#xe503;</span>
            </li>
        </ul>

    </div>
    <!-- 头部广告 -->
    <div id="headAd">
        <div class="clearfix layer">
            <a href="#" class="fl go"><img src="imgs/go.png" alt=""></a>
            <ul class="fr">
                <li class="item1">
                    <a href="" class="fr"><img src="imgs/adimg_01.jpg" alt=""></a>
                    <h3><a href="#">标题</a></h3>
                    <p><a href="#">副标题</a></p>
                </li>
                <li class="item2">
                    <a href="" class="fr"><img src="imgs/adimg_03.jpg" alt=""></a>
                    <h3><a href="">标题</a></h3>
                    <p><a href="">副标题</a></p>
                </li>
                <li class="item3">
                    <a href="" class="fr"><img src="imgs/adimg_03.jpg" alt=""></a>
                    <h3><a href="">标题</a></h3>
                    <p><a href="">副标题</a></p>
                </li>
                <li class="item4">
                    <a href="" class="fr"><img src="imgs/adimg_04.jpg" alt=""></a>
                    <h3><a href="">标题</a></h3>
                    <p><a href="">副标题</a></p>
                </li>
                <li class="item5">
                    <a href="" class="fr"><img src="imgs/adimg_05.jpg" alt=""></a>
                    <h3><a href="">标题</a></h3>
                    <p><a href="">副标题</a></p>
                </li>
            </ul>
        </div>
    </div>
    <!-- 头部搜索 -->
    <div id="headSearch">
        <div class="clearfix layer">
            <h1 class="fl"><a href="#">淘宝网</a></h1>

            <div class="code fr">
                <span class="iconfont close">&#xe614;</span>
                <span>手机淘宝</span>
                <img src="imgs/code.png" alt="">
            </div>

            <div class="search">

                <ul class="searchTab clearfix">
                    <li class="active">宝贝</li>
                    <li>天猫</li>
                    <li>店铺</li>
                </ul>

                <div class="searchContent clearfix">
                    <div class="searchBox fl">
                        <input type="text">
                        <div class="placeholder">
                            <i class="iconfont">&#xe615;</i>
                            <span>网红裤腰带 洋气 国际范 9.9包邮</span>
                        </div>
                        <span class="iconfont imageSearch">&#xe6ba;</span>
                    </div>
                    <div class="btn fr">
                        <button type="submit">搜索</button>
                    </div>
                </div>

                <div class="hotKey">
                    <a href="" class="c5">积木</a>
                    <a href="">网线</a>
                    <a href="" class="c5">时尚连衣裙</a>
                    <a href="">粽子</a>
                    <a href="" class="c5">沙发</a>
                </div>
                

            </div>

        </div>
    </div>
    <!-- 导航栏 -->
    <div id="nav" class="layer clearfix">
        <h2 class="fl theam">主题市场</h2>
        <ul>
            <li><a href="" class="size">天猫</a></li>
            <li><a href="" class="size">聚划算</a></li>
            <li>|</li>
            <li><a href="">飞猪旅行</a></li>
            <li><a href="">智能生活</a></li>
            <li><a href="">苏宁易购</a></li>
        </ul>
    </div>

    <!-- 首屏内容 -->
    <div id="firstScreen" class="layer clearfix">
        <div class="leftView">
            <div class="leftNav"></div>
            <div class="rightTopImg"></div>
            <div class="rightBottomImg"></div>
            <div class="bottomImg"></div>
        </div>
        <div class="rightView"></div>
    </div>
</body>
</html>